From: Rares Visalom Date: Wed, 12 Jul 2017 23:51:59 +0000 (+0300) Subject: search: Refactor providerIcon into providerInfo X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~1013^2^2~249 X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=faa0ddafff7bc30ab16d9a6149ead909554526d4;p=gnome-shell.git search: Refactor providerIcon into providerInfo In order to match the current mockups, the providerIcon class needed to include both the name of the provider and the label that informs the user about how many more search results are available for that specific provider. The latter replaces the plus sign icon that has been used so far. https://bugzilla.gnome.org/show_bug.cgi?id=749957 --- diff --git a/data/gnome-shell-theme.gresource.xml b/data/gnome-shell-theme.gresource.xml index 76aeaa579..25769a477 100644 --- a/data/gnome-shell-theme.gresource.xml +++ b/data/gnome-shell-theme.gresource.xml @@ -18,7 +18,6 @@ gnome-shell.css gnome-shell-high-contrast.css logged-in-indicator.svg - more-results.svg no-events.svg no-notifications.svg noise-texture.png diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css index d639e3094..fc16943c5 100644 --- a/data/theme/gnome-shell-high-contrast.css +++ b/data/theme/gnome-shell-high-contrast.css @@ -1189,14 +1189,17 @@ StScrollBar { .list-search-result-description { color: #cacac4; } +.list-search-provider-details { + width: 150px; + color: #e2e2df; + margin-top: 0.24em; } + +.list-search-provider-content { + spacing: 20px; } + .search-provider-icon { padding: 15px; } -.search-provider-icon-more { - width: 16px; - height: 16px; - background-image: url("resource:///org/gnome/shell/theme/more-results.svg"); } - /* DASHBOARD */ #dash { font-size: 9pt; diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass index 6a5935538..07f43e042 160000 --- a/data/theme/gnome-shell-sass +++ b/data/theme/gnome-shell-sass @@ -1 +1 @@ -Subproject commit 6a5935538568835462fa853f746620967d047bcf +Subproject commit 07f43e04251e0daedf2828a5b15c007e8e57fb05 diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index 6d5559a2d..e1132c79e 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -1189,14 +1189,17 @@ StScrollBar { .list-search-result-description { color: #cacac4; } +.list-search-provider-details { + width: 150px; + color: #e2e2df; + margin-top: 0.24em; } + +.list-search-provider-content { + spacing: 20px; } + .search-provider-icon { padding: 15px; } -.search-provider-icon-more { - width: 16px; - height: 16px; - background-image: url("resource:///org/gnome/shell/theme/more-results.svg"); } - /* DASHBOARD */ #dash { font-size: 9pt; diff --git a/data/theme/more-results.svg b/data/theme/more-results.svg deleted file mode 100644 index d2fe5f253..000000000 --- a/data/theme/more-results.svg +++ /dev/null @@ -1,114 +0,0 @@ - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - - diff --git a/js/ui/search.js b/js/ui/search.js index 0dd4870ff..4f9729ea8 100644 --- a/js/ui/search.js +++ b/js/ui/search.js @@ -102,6 +102,7 @@ const ListSearchResult = new Lang.Class({ y_fill: false, x_align: St.Align.START, y_align: St.Align.MIDDLE }); + this.actor.label_actor = title; if (this.metaInfo['description']) { @@ -189,7 +190,7 @@ const SearchResultsBase = new Lang.Class({ Main.overview.toggle(); }, - _setMoreIconVisible: function(visible) { + _setMoreCount: function(count) { }, _ensureResultActors: function(results, callback) { @@ -240,7 +241,7 @@ const SearchResultsBase = new Lang.Class({ } else { let maxResults = this._getMaxDisplayedResults(); let results = this.provider.filterResults(providerResults, maxResults); - let hasMoreResults = results.length < providerResults.length; + let moreCount = Math.max(providerResults.length - results.length, 0); this._ensureResultActors(results, Lang.bind(this, function(successful) { if (!successful) { @@ -257,7 +258,7 @@ const SearchResultsBase = new Lang.Class({ results.forEach(Lang.bind(this, function(resultId) { this._addItem(this._resultDisplays[resultId]); })); - this._setMoreIconVisible(hasMoreResults && this.provider.canLaunchSearch); + this._setMoreCount(this.provider.canLaunchSearch ? moreCount : 0); this.actor.show(); callback(); })); @@ -273,16 +274,16 @@ const ListSearchResults = new Lang.Class({ this.parent(provider); this._container = new St.BoxLayout({ style_class: 'search-section-content' }); - this.providerIcon = new ProviderIcon(provider); - this.providerIcon.connect('key-focus-in', Lang.bind(this, this._keyFocusIn)); - this.providerIcon.connect('clicked', Lang.bind(this, + this.providerInfo = new ProviderInfo(provider); + this.providerInfo.connect('key-focus-in', Lang.bind(this, this._keyFocusIn)); + this.providerInfo.connect('clicked', Lang.bind(this, function() { - this.providerIcon.animateLaunch(); + this.providerInfo.animateLaunch(); provider.launchSearch(this._terms); Main.overview.toggle(); })); - this._container.add(this.providerIcon, { x_fill: false, + this._container.add(this.providerInfo, { x_fill: false, y_fill: false, x_align: St.Align.START, y_align: St.Align.START }); @@ -294,8 +295,8 @@ const ListSearchResults = new Lang.Class({ this._resultDisplayBin.set_child(this._container); }, - _setMoreIconVisible: function(visible) { - this.providerIcon.moreIcon.visible = visible; + _setMoreCount: function(count) { + this.providerInfo.setMoreCount(count); }, _getMaxDisplayedResults: function() { @@ -679,8 +680,8 @@ const SearchResults = new Lang.Class({ } }); -const ProviderIcon = new Lang.Class({ - Name: 'ProviderIcon', +const ProviderInfo = new Lang.Class({ + Name: 'ProviderInfo', Extends: St.Button, PROVIDER_ICON_SIZE: 48, @@ -693,22 +694,28 @@ const ProviderIcon = new Lang.Class({ accessible_name: provider.appInfo.get_name(), track_hover: true }); - this._content = new St.Widget({ layout_manager: new Clutter.BinLayout() }); + this._content = new St.BoxLayout({ vertical: false, + style_class: 'list-search-provider-content' }); this.set_child(this._content); - let rtl = (this.get_text_direction() == Clutter.TextDirection.RTL); - - this.moreIcon = new St.Widget({ style_class: 'search-provider-icon-more', - visible: false, - x_align: rtl ? Clutter.ActorAlign.START : Clutter.ActorAlign.END, - y_align: Clutter.ActorAlign.END, - x_expand: true, - y_expand: true }); - let icon = new St.Icon({ icon_size: this.PROVIDER_ICON_SIZE, gicon: provider.appInfo.get_icon() }); + + let detailsBox = new St.BoxLayout({ style_class: 'list-search-provider-details', + vertical: true, + x_expand: true }); + + let nameLabel = new St.Label({ text: provider.appInfo.get_name(), + x_align: Clutter.ActorAlign.START }); + + this._moreLabel = new St.Label({ x_align: Clutter.ActorAlign.START }); + + detailsBox.add_actor(nameLabel); + detailsBox.add_actor(this._moreLabel); + + this._content.add_actor(icon); - this._content.add_actor(this.moreIcon); + this._content.add_actor(detailsBox); }, animateLaunch: function() { @@ -716,5 +723,10 @@ const ProviderIcon = new Lang.Class({ let app = appSys.lookup_app(this.provider.appInfo.get_id()); if (app.state == Shell.AppState.STOPPED) IconGrid.zoomOutActor(this._content); + }, + + setMoreCount: function(count) { + this._moreLabel.text = _("%d more").format(count); + this._moreLabel.visible = count > 0; } });